<template>

	<div class="fillcontain" v-if="tickFlag" >
		<el-card class="box-card">
			<div slot="header" class="clearfix">
				<span>小票格式配置</span>
			</div>
			
			<el-row>
				<el-col>
					<el-form :inline="true" ref="form" :model="form" label-width="80px">
						
						<el-form-item label="小票名称">
							<el-input v-model="form.name"></el-input>
						</el-form-item>
						<el-form-item label="门店">
							<el-select v-model="form.mallid" filterable placeholder="请选择">
								<el-option
									v-for="item in options"
									:key="item.value"
									:label="item.label"
									:value="item.value">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="打印次数">
							<el-input style="width:86px;" v-model="form.dycs"></el-input>
						</el-form-item>
						 
						<el-form-item  style="text-align:right">
							<el-button type="primary" @click="saveTickFn()" >保存</el-button>
						</el-form-item>
						<el-form-item label="小票类型" :span="24">
							<el-radio-group v-model="form.ticktype==null?(form.ticktype=1):form.ticktype">
								<el-radio v-for="item in ticketData.tType"  :label="item.value"   >{{item.label}}</el-radio>
								<!-- <el-radio label="销售补打小票"></el-radio> -->
							</el-radio-group>
						</el-form-item>
					</el-form>
					<el-tabs type="border-card">
						<el-tab-pane label="小票格式">
							<ticket-layout v-show="form.ticktype==1" :ticktype="1" :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_SALE" />
							<ticket-layout v-show="form.ticktype==2" :ticktype="2" :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_FSALE" />
							<ticket-layout v-show="form.ticktype==3" :ticktype="3" :tickOption="ticketData.tOptionReturn"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_RETURN" />
							<ticket-layout v-show="form.ticktype==4" :ticktype="4" :tickOption="ticketData.tOptionReturn"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_FRETURN" />
							<ticket-layout v-show="form.ticktype==5" :ticktype="5" :tickOption="ticketData.tOptionClass"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_CLASS" />
							<ticket-layout v-show="form.ticktype==6" :ticktype="6" :tickOption="ticketData.tOptionDay"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_DAILY" />
							</el-tab-pane>
					</el-tabs>
				
					<!-- <el-tabs type="border-card">
						<el-tab-pane label="销售小票">
							<ticket-layout :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_SALE" />
						</el-tab-pane>
						<el-tab-pane label="销售补打小票"> 
							<ticket-layout :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_FSALE" />
						</el-tab-pane>
						<el-tab-pane label="退货小票">
							<ticket-layout :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_RETURN" />
						</el-tab-pane>
						<el-tab-pane label="退货补打小票">
							<ticket-layout :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_FRETURN" />
						</el-tab-pane>
						<el-tab-pane label="班报">
							<ticket-layout :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_CLASS" />
						</el-tab-pane>
						<el-tab-pane label="日报">
							<ticket-layout :tickOption="ticketData.tOption"  :ticketData="ticketData" :ticketSale="form.TICKTYPE_DAILY" />
						</el-tab-pane>
					</el-tabs> -->
				</el-col>
			</el-row>

		</el-card>
 
		<!-- <div class="modal-footer">
			<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			<button type="submit" class="btn btn-primary" id="ticketSubmit">保存</button>
		</div> -->


	</div> 
</template>

<script>
	// import headTop from '../components/headTop'
	import { baseUrl, baseImgPath } from "@/config/env";
	import { getMallLists, saveMalldef } from "@/api/getData";
	import { getTickGetIdFn, saveTickFn } from '@/api/getData'
	import ticketLayout from "@/components/v-ticketLayout";
	export default {
		data() {
			return {
				baseUrl,
				baseImgPath,
				searchLoading: false,
				tickFlag:false,
				form:null, 
				ticketData:{
					// 销售小票 销售补打小票 退货小票 退货补打小票 班报 日报
					tType:[
						{
							value:1,
							label:'销售小票'
						},{
							value:2,
							label:'销售补打小票'
						},{
							value:3,
							label:'退货小票'
						},{
							value:4,
							label:'退货补打小票'
						},{
							value:5,
							label:'班报'
						},{
							value:6,
							label:'日报'
						}
					],
					tOptionDay:[
						{
							value:0,
							label:'基础设置'
						},{
							value:1,
							label:'日报头'
						},{
							value:2,
							label:'日报尾'
						},{
							value:3,
							label:'日报内容'
						}],
					tOptionClass:[
						{
							value:0,
							label:'基础设置'
						},{
							value:1,
							label:'班报头'
						},{
							value:2,
							label:'班报尾'
						},{
							value:3,
							label:'班报内容'
						}],
					tOptionReturn:[
						{
							value:0,
							label:'基础设置'
						},
						{
							value:'1',
							label:'小票头'
						},
						{
							value:2,
							label:'小票尾'
						},
						{
							value:3,
							label:'商品信息'
						},
						{
							value:4,
							label:'金额信息'
						},
						{
							value:5,
							label:'会员信息'
						},
						{
							value:6,
							label:'银行卡信息'
						},
						{
							value:7,
							label:'优惠券退回信息'
						},
						{
							value:8,
							label:'优惠券退回信息'
						},
						{
							value:9,
							label:'优惠券拥有信息'
						}
					],
					tOption:[
						{
							value:0,
							label:'基础设置'
						},
						{
							value:'1',
							label:'小票头'
						},
						{
							value:2,
							label:'小票尾'
						},
						{
							value:3,
							label:'商品信息'
						},
						{
							value:4,
							label:'金额信息'
						},
						{
							value:5,
							label:'会员信息'
						},
						{
							value:6,
							label:'银行卡信息'
						},
						{
							value:7,
							label:'优惠券发放信息'
						},
						{
							value:8,
							label:'优惠券使用信息'
						},
						{
							value:9,
							label:'优惠券拥有信息'
						}
					],
					tContainer:{
						config:{
						},
					},

				},
				options: [],
			};
		},
		props:['allTabs','activeTab'],
		mounted(){
			console.log('allTabs',activeTab)
		},
		created() {
			// this.initData();
		},
		activated() {
			this.initData();
		},

		components: {
			// headTop,
			ticketLayout
		},
		methods: {
			initData(){
				var data = {
                    id:this.$route.params.id
                }
                this.getTickGetIdFn(data);
                // this.getMallLists();
			},
			async saveTickFn(){
				var data = this.form
				data.djsj=null
				console.log('2222222222222')
				console.log(data);
				
				const mall = await saveTickFn(data);
				console.log('mall',mall)
				if (mall.Status==0&&mall.success==true) {
					this.$message({
						type: 'success',
						message: '添加成功'
					});
					this.$router.push('/tickList')
				}else{

					this.$message({
						type: 'error',
						message: '系统异常'
					});
					this.$router.push('/tickList')
				}
            }, 
			async getMallLists(){
				var data = {
                    page:1,
                    rows:999,
                    yttype:0
                }
				console.log('10111111111111111111')
				const mall = await getMallLists(data);
				console.log('mall',mall)
				this.options = mall.rows.map((item)=>{return {value:item.id, label:item.name}})
            }, 
			async getTickGetIdFn(data){
                var _this = this 
				const tick = await getTickGetIdFn(data);
				console.log(tick.data)
				this.tickFlag = true
				this.form = tick.data
            },   
			handleSelect(item) {
				console.log(item);
			},
			handleIconClick(ev) {
				console.log(ev);
			}
		},
		mounted() { 
		}
	};
</script>

<style scoped>
	section .pdl-100 {
		padding-left: 100px;
		position: relative;
	}

	section .first {
		position: absolute;
		left: 15px;
	}

	.config-sort .input input {
		width: 37px;
		display: inline-block;
		text-align: center;
	}
</style>
<style lang="less" scoped>
 
.my-autocomplete {
  li {
    line-height: normal;
    padding: 7px;

    .name {
      text-overflow: ellipsis;padding-top: 7px;
      overflow: hidden;line-height: 18px;
    }
    .addr {
      font-size: 12px;line-height: 16px;padding-bottom:7px;
      color: #b4b4b4;display:block;
    }

    .highlighted .addr {
      color: #ddd;
    }
  }
}
</style>